<style>
  #app{display: table;width:100%;}
  body{background: #fff;}


 .paypassword  .identity_all{
  	border:1px solid #dcdcdc;
  	margin-top:20px;
  	padding-bottom: 50px;
  }
 .paypassword  .identity_all .identity_header{
  	border-width:0 0 1px 0;
  	margin-top:0;
  }
 .paypassword  .identity_content .el-form{
  	max-width:540px;
  	margin:40px auto;
  }
 .paypassword  .identype{display: flex;flex-direction: column;}
  .paypassword .identype .el-form-item__label{text-align: left;}
  .paypassword .info_item{padding:15px 0;}
  .paypassword .info_label{width: 80px;display: inline-block;}
  .paypassword .forget{cursor: pointer;}
</style>
<template>
  <div>
    <div class="">
		
	    <div class="login_content paypassword">  
	  		<div class="usercenter_all">
  				<div class="identity_header">      			
  	      			<el-breadcrumb separator="/" class="bread" id="mybread">
  				        <el-breadcrumb-item v-for="(item,index) in breadcrumbs" :key="index" :to="item">
  				          {{ item.meta.name || item.name }}
  				        </el-breadcrumb-item>
  				      </el-breadcrumb>
  	      		</div>
  			</div>   
        <div class="usercenter_all identity_all">
          <div v-if="!isSetPayPassword" class="identity_header">设置资金密码</div>
          <div v-if="isSetPayPassword" class="identity_header">修改资金密码</div>
          <div class="identity_content">

            <el-form :model="identForm" class="login-form" :rules="identFormRules" ref="identForm">
                   
                  <el-form-item v-if="isSetPayPassword" label="原资金密码"  prop="oldPassword">
                    <el-input  :autofocus="true"  v-model="identForm.oldPassword">
                    </el-input>
                    <span class="forget" @click="forgetPass">忘记密码</span>
                  </el-form-item>
                     <el-form-item label="新资金密码"  prop="password">
                    <el-input  :autofocus="true"  v-model="identForm.password">
                    </el-input>
                  </el-form-item>
                     <el-form-item label="确认新密码"  prop="repassword">
                    <el-input  :autofocus="true"  v-model="identForm.repassword">
                    </el-input>
                  </el-form-item>
                           
      
                  <el-form-item class="btn_reg">
                    <el-button  @click.native="setpaySubmit" type="primary" :loading="isBtnLoading">提交</el-button>
                     <el-button @click="resetForm('identForm')">重置</el-button>
                  </el-form-item>
                
                </el-form>
          </div>  

        </div>
         
	  			
	   
	    </div>
		
    </div>
   
  </div>
</template>

<script>
import * as users from '../api/users';
import myHeader from './common/header'
import md5 from 'js-md5';



var code ; //在全局定义验证码
export default {
  components:{
    myHeader
  },
	computed: {   
	   
  	},
  data() {
    var validatePass = (rule, value, callback) => {   
      if (value === '') {
          callback(new Error('请再次输入密码'));
        } else if (value !== this.identForm.password) {
          callback(new Error('两次输入密码不一致!'));
        } else {
          callback();
        }
    };
    return {

    	isBtnLoading:false,
    	identForm:{},
    	identFormRules:{    		
	        oldPassword: [
	          { required: true, message: '请输入旧密码', trigger: 'blur' }
	        ],
    			password: [
  	          { required: true, message: '请输入新密码', trigger: 'blur' }
	        ],
    			repassword: [
  	          { required: true, trigger: 'blur' ,validator:validatePass}
	        ],
    	},
    	userId:'',
    	list:[],
    	showCount:20,
		total:0,
      	page: 1,
		onOff:true,
   
      picLyanzhengma:'',
      checkCode:'',
      username: '',
      password: '',
      isBtnLoading: false,
      routerPath:'',
      isRealName:false,
      userInfo:'',
      isSetPayPassword:false,
    };
  },
  computed: {   
 	activeMenu: function(){
      // return this.$route.name
      return this.$route.path
    },
    breadcrumbs: function(){
      return (this.$route && this.$route.matched) || []
    }
  },
  methods: {
    forgetPass(){
      this.$router.push("/personalcenter/forgetpaypassword")
    },
    resetForm(formName) {
        this.$refs[formName].resetFields();
    },
  	 //数字显示转换
    formatSex: function (row) {
    	console.log(row)
      return row.idCardType == 1 ? '身份证' : row.idCardType == 2 ? '军官证' : '护照';
    },
  	setpaySubmit(){
      this.$refs.identForm.validate((valid) => {
        if (valid) {
        	// let para=this.identForm;
          let para={
            password:md5('STARSAND_' + this.identForm.password),
            userId:this.userId,
            isSetPayPassword:this.identForm.isSetPayPassword,
          }
          // para.password=md5('STARSAND_' + this.identForm.password)
          if(this.isSetPayPassword){
            para.oldPassword=md5('STARSAND_' + this.identForm.oldPassword)
          }
        	// para.userId=this.userId;
        	console.log(para);
        	users.setPayPassword.r(para).then((res)=>{
        		console.log(res)
        		if(res.data.retCode==1){
              this.$message("资金密码设置成功");
              this.$router.push("/personalcenter")
        	/*		this.fetchDataUser();
        			this.isRealName=true;*/
        		}else{
        			this.$message.error(res.data.retMsg);
        		}
        	})
        }else{
          console.log('error submit!!');
          return false;
        }
      })

  	},
 
    fetchDataUser(){
    	//获取用户信息
    	let para={
    		userId:this.userId,
    	}
	  	users.info.r(para).then((res) => {
	  		console.log(res)
	  		if(res.data.retCode==1){
  				// this.identForm.authLevel=res.data.data.authLevel;
          this.identForm.isSetPayPassword=res.data.data.isSetPayPassword;
  				this.realName=res.data.data.realName;
  				if(res.data.data.realName){
  					this.isRealName=true;
  				}else{
  					this.isRealName=false;
  				}
          if(res.data.data.isSetPayPassword==1){
            this.isSetPayPassword=true;
          }else{
            this.isSetPayPassword=false;
          }
  				this.userInfo=res.data.data;
  				this.userInfo.idCardType=this.formatSex(this.userInfo);
  				sessionStorage.setItem("localUser",JSON.stringify(res.data.data))

	  		}else{
	  			this.$message.error(res.data.retMsg);
	  		}
	       
	       

	      });
    },
  	handEdit(){

  	},

  },

  created() {
    // this.fetchData();
    this.userId=sessionStorage.getItem("userId");
    this.fetchDataUser();
    
  }
};
</script>
